<template>
	<view class="container">
		
		<!-- 升级弹窗组件 -->
		<UpdatePopup />
		<!-- 会员引导自定义弹窗 -->
		<view class="vip-modal" v-if="showVipModal">
			<view class="vip-modal-content">
				<!-- 弹窗头部 -->
				<view class="vip-modal-header">
					<view class="vip-icon">
						<image src="/static/vip.png" mode="aspectFit"></image>
					</view>
					<text class="vip-modal-title">下载次数不足</text>
					<view class="close-btn" @click="closeVipModal">✕</view>
				</view>

				<!-- 弹窗内容 -->
				<view class="vip-modal-body">
					<text class="vip-modal-message">您今日的免费下载次数已用完</text>

					<view class="vip-benefits">
						<text class="vip-benefits-title">💎 开通会员即可享受:</text>
						<view class="benefit-item">
							<text class="benefit-icon">✓</text>
							<text class="benefit-text">无限制下载次数</text>
						</view>
						<view class="benefit-item">
							<text class="benefit-icon">✓</text>
							<text class="benefit-text">无广告体验</text>
						</view>
						<view class="benefit-item">
							<text class="benefit-icon">✓</text>
							<text class="benefit-text">高速下载</text>
						</view>
						<view class="benefit-item">
							<text class="benefit-icon">✓</text>
							<text class="benefit-text">更多高级功能</text>
						</view>
					</view>
				</view>

				<!-- 弹窗底部按钮 -->
				<view class="vip-modal-footer">
					<button class="cancel-vip-btn" @click="closeVipModal">取消</button>
					<button class="confirm-vip-btn" @click="gotoVipPage">立即开通</button>
				</view>
			</view>
		</view>
		<!-- 广告Banner -->
		<view class="banner">
			<image src="/static/banner.jpg" class="banner-image" mode="aspectFill"></image>
		</view>

		<!-- 公告栏 -->
		<custom-notice-bar 
		  text="欢迎使用去水印小程序，支持抖音、快手、小红书等20+主流平台" 
		  :scrollable="true"
		  :show-icon="true"
		  background-color="#fffbe8"
		  color="#de8c17"
		></custom-notice-bar>
		<!-- 快速去水印 -->
		<view class="quick-section">
			<view class="section-header">
				<text class="section-title">快速去水印</text>
				<text class="section-action" @click="clearInput">清空</text>
			</view>

			<view class="input-area">
				<input type="text" placeholder="请粘贴需要提取的视频/图集链接" class="url-input" v-model="url" />
			</view>

			<view class="button-group">
				<button class="paste-btn" @click="pasteLink">粘贴链接</button>
				<button class="parse-btn" @click="parseLink"
					:loading="isLoading">{{ isLoading ? '解析中...' : '立即解析' }}</button>
			</view>
		</view>

		<!-- 解析结果展示 -->
		<view class="result-section" v-if="parseResult">
			<view class="section-header">
				<text class="section-title">解析结果</text>
			</view>

			<!-- 视频信息 -->
			<view class="video-info" v-if="parseResult.title">
				<text class="video-title">{{ parseResult.title }}</text>
			</view>

			<!-- 作者信息 -->
			<view class="author-info" v-if="parseResult.author">
				<image :src="parseResult.author.avatar" class="author-avatar" mode="aspectFill"></image>
				<text class="author-name">{{ parseResult.author.name }}</text>
			</view>

			<!-- 视频预览组件 -->
			<view class="video-preview" v-if="parseResult.video_url && videoVisible">
				<video :src="parseResult.video_url" :poster="parseResult.cover_url || ''" controls autoplay loop muted
					:show-center-play-btn="true" :enable-progress-gesture="true" class="video-player"></video>
			</view>

			<!-- 图集预览组件 -->
			<view class="images-preview" v-if="parseResult.images && parseResult.images.length > 0">
				<view class="image-item" v-for="(imageObj, index) in parseResult.images" :key="index">
					<image :src="formatImageUrl(imageObj.url)" class="preview-image" mode="aspectFill"
						@click="previewImage(imageObj.url, parseResult.images)"></image>
					<button class="save-single-image-btn"
						@click="downloadSingleImage(imageObj.url, $event)">保存图片</button>
				</view>
			</view>
			
			<!-- 免费次数显示 -->
			<view class="free-count-info" v-if="isLoggedIn()">
				<view class="free-count-card">
					<text class="free-count-icon">🎁</text>
					<text class="free-count-text">今日免费下载次数</text>
					<text class="free-count-number">{{ freeCount }}</text>
				</view>
			</view>
			
			<!-- 操作按钮 -->
			<view class="action-buttons">
				<view class="button-row">
					<button class="download-btn" @click="handleOperationWithLoginCheck('downloadVideo')" 
						v-if="parseResult.video_url">下载视频</button>
					<button class="download-btn" @click="handleOperationWithLoginCheck('downloadImages')" 
						v-if="parseResult.images && parseResult.images.length > 0">下载图集</button>
					<button class="download-btn" @click="handleOperationWithLoginCheck('downloadCover')" 
						v-if="parseResult.cover_url">下载封面</button>
				</view>
				<view class="button-row">
					<button class="download-btn" @click="handleOperationWithLoginCheck('copyVideoUrl')" 
						v-if="parseResult.video_url">复制地址</button>
				</view>
			</view>
		</view>

		<!-- 更多功能 -->
		<view class="more-section">
			<text class="more-title">更多功能</text>

			<view class="feature-grid">
				<!-- <view class="feature-item feature-pink" @click="navigateToMd5Edit">
          <text class="feature-name">修改MD5</text>
          <text class="feature-desc">上热门必备...</text>
        </view> -->
				<view class="feature-item feature-orange">
					<text class="feature-name">批量解析</text>
					<text class="feature-desc">批量解析视频...</text>
				</view>
				<view class="feature-item feature-purple">
					<text class="feature-name">待开发</text>
					<text class="feature-desc">更多功能待...</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
  import CustomNoticeBar from '../../components/custom-notice-bar/custom-notice-bar.vue'
  import UpdatePopup from '../../components/update-popup/update-popup.vue'
  import util from '../../utils/util.js'

  export default {
		components: {
			CustomNoticeBar,
			UpdatePopup
		},
		data() {
			return {
				title: '奇遇去水印',
				url: '',
				parseResult: null,
				isLoading: false,
				freeCount: 0, // 用户今日免费下载次数
				processedUrls: {}, // 已处理过的链接，用于记录是否已经扣除过免费次数
				showVipModal: false, // 控制会员弹窗显示
				videoVisible: true, // 控制视频组件显示
				// 不再需要硬编码版本号，组件会自动获取
			}
		},
		onLoad() {
			// 页面加载时的逻辑
			if (this.isLoggedIn()) {
				this.fetchFreeCount();
			}
		},
		onShow() {
			// 页面显示时重新检查登录状态和免费次数
			if (this.isLoggedIn()) {
				this.fetchFreeCount();
			}
		},

		created() {
			// 监听来自record页面的URL解析事件
			this.urlListener = uni.$on('setParseUrl', (url) => {
				if (url) {
					this.url = url;
					this.parseLink();
				}
			});
		},

		destroyed() {
			// 清理事件监听器
			if (this.urlListener) {
				uni.$off('setParseUrl', this.urlListener);
			}
		},
		watch: {
			// 监听url变化，当用户自行粘贴内容时自动过滤出有效链接
			url: {
				handler(newVal) {
					if (newVal && newVal.trim()) {
						const parsedUrl = util.handleUrl(newVal.trim())
						if (parsedUrl && parsedUrl !== newVal.trim()) {
							// 如果过滤后的URL与原始输入不同，则更新输入框内容
							this.url = parsedUrl
						}
					}
				}
			}
		},
		methods: {
			// 检查用户是否已登录
			isLoggedIn() {
				const token = uni.getStorageSync('loginToken');
				const username = uni.getStorageSync('username');
				return !!token && !!username;
			},

			// 获取用户今日免费下载次数
			fetchFreeCount() {
				const userId = uni.getStorageSync('userId');
				// console.log(userId);
				if (!userId) return;
				const token = uni.getStorageSync('loginToken');
				uni.request({
					url: `https://qyapi.ipaybuy.cn/api/get_user_app_free_count?id=${userId}`,
					method: 'GET',
					header: {
						'token': `${token}`,
						'content-type': 'application/json'
					},
					success: (res) => {
						if (res.statusCode === 200 && res.data && res.data.code === 200) {
							this.freeCount = res.data.data;
							// console.log(this.freeCount);
						}
					},
					fail: (err) => {
						console.error('获取免费次数失败', err);
					}
				});
			},

			// 扣除免费次数
			deductFreeCount(videoUrl) {
				// 检查该链接是否已经处理过，避免重复扣除
				if (this.processedUrls[videoUrl]) {
					return Promise.resolve(false); // 已扣除过，不需要再次扣除
				}

				const userId = uni.getStorageSync('userId');
				if (!userId) {
					return Promise.reject('未登录');
				}
				const token = uni.getStorageSync('loginToken');
				return new Promise((resolve, reject) => {
					uni.request({
						url: `https://qyapi.ipaybuy.cn/api/deduct_user_app_free_count?id=${userId}`,
						method: 'GET',
						header: {
							'token': `${token}`,
							'content-type': 'application/json'
						},
						success: (res) => {
							if (res.statusCode === 200 && res.data && res.data.code === 200) {
								// 标记该链接已处理
								this.processedUrls[videoUrl] = true;
								// 更新免费次数
								this.fetchFreeCount();
								resolve(true); // 扣除成功
							} else {
								reject(res.data?.msg || '扣除免费次数失败');
							}
						},
						fail: (err) => {
							reject('网络请求失败');
						}
					});
				});
			},

			// 检查登录状态并处理操作
			async handleOperationWithLoginCheck(operation, ...args) {
				if (!this.isLoggedIn()) {
					util.showToast('请先登录');
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/login/login'
						});
					}, 1200);
					return false;
				}

				// 检查免费次数
				if (this.freeCount <= 0) {
					this.showVipPrompt();
					return false;
				}

				// 登录状态且有免费次数时执行操作
				try {
					await this.deductFreeCount(this.parseResult.video_url);
					this[operation](...args);
					return true;
				} catch (error) {
					console.error('操作失败', error);
					// 即使扣除失败，也允许用户继续操作
					this[operation](...args);
					return true;
				}
			},

			// 显示会员开通提示弹窗
			showVipPrompt() {
				this.videoVisible = false; // 隐藏视频组件
				this.showVipModal = true;
			},

			// 关闭会员弹窗
			closeVipModal() {
				this.showVipModal = false;
				setTimeout(() => {
					this.videoVisible = true; // 延迟显示视频组件，避免弹窗关闭时出现闪烁
				}, 300);
			},

			// 跳转到VIP页面
			gotoVipPage() {
				this.showVipModal = false;
				this.videoVisible = true; // 恢复视频显示
				uni.navigateTo({
					url: '/pages/vip/vip'
				});
			},
			// 粘贴链接按钮点击事件
			pasteLink() {
				// 实现粘贴链接功能
				uni.getClipboardData({
					success: (res) => {
						// 提取剪贴板中的URL
						const url = util.handleUrl(res.data)
						if (url) {
							this.url = url
							util.showToast('已成功粘贴链接')
						} else {
							util.showToast('未检测到有效链接')
						}
					},
					fail: (err) => {
						console.error('获取剪贴板数据失败', err)
						util.showToast('获取剪贴板数据失败')
					}
				})
			},

			// 立即解析按钮点击事件
			parseLink() {
				const url = util.handleUrl(this.url.trim())

				if (!url) {
					util.showToast('请输入有效的视频链接')
					return
				}

				// 显示加载提示
				this.isLoading = true
				/**
				 * 解析接口由奇云api官方大佬提供免费体验服务
				 * https://qyapi.ipaybuy.cn/  获取自己的稳定key，前往网站注册就可以了
				 * 作者的你们就别乱用，到时封了我就无法使用了
				 */
				// 构建请求URL
				const baseUrl = 'https://qyapi.ipaybuy.cn/api/video'
				const appId = '115000'
				const appKey = '1a4f8dr2go0ddhq9qcnkzpa3007opevv'
				const requestUrl = `${baseUrl}?appId=${appId}&appKey=${appKey}&url=${encodeURIComponent(url)}`

				// 发送请求
				uni.request({
					url: requestUrl,
					method: 'GET',
					success: (res) => {
						// 隐藏加载提示
						this.isLoading = false

						// 处理响应数据
						if (res.statusCode === 200 && res.data && res.data.code === 200) {
							this.parseResult = res.data.data
							console.log('解析成功', this.parseResult)

							// 保存解析记录
							this.saveParseRecord(url, this.parseResult)

							util.showToast('解析成功')

						} else {
							util.showToast(res.data?.msg || '解析失败，请稍后重试')
							console.error('解析失败', res)
						}
					},
					fail: (err) => {
						// 隐藏加载提示
						this.isLoading = false

						util.showToast('网络请求失败，请检查网络连接')
						console.error('请求失败', err)
					}
				})
			},

			// 清空按钮点击事件
			clearInput() {
				// 清空输入框和解析结果
				this.url = ''
				this.parseResult = null
			},

			// 跳转到MD5修改页面
			navigateToMd5Edit() {
				uni.navigateTo({
					url: '/pages/md5-video-edit/md5-video-edit'
				})
			},

			// 保存解析记录到本地存储
			saveParseRecord(originalUrl, parseResult) {
				try {
					// 从本地存储获取现有记录
					let records = uni.getStorageSync('parseRecords') || [];

					// 创建新记录
					const newRecord = {
						id: Date.now(), // 使用时间戳作为唯一ID
						originalUrl: originalUrl,
						title: parseResult.title || '无标题',
						videoUrl: parseResult.video_url,
						coverUrl: parseResult.cover_url,
						author: parseResult.author?.name || '',
						hasImages: parseResult.images && parseResult.images.length > 0,
						parseTime: new Date().toISOString()
					};

					// 将新记录添加到开头
					records.unshift(newRecord);

					// 限制记录数量，最多保存100条
					if (records.length > 100) {
						records = records.slice(0, 100);
					}

					// 保存回本地存储
					uni.setStorageSync('parseRecords', records);
					console.log('解析记录已保存', newRecord);
				} catch (error) {
					console.error('保存解析记录失败', error);
				}
			},

			// 下载视频
			downloadVideo() {
				if (!this.parseResult || !this.parseResult.video_url) {
					util.showToast('视频链接无效')
					return
				}

				// 显示加载提示
				this.isLoading = true

				// 调用uni.downloadFile进行下载
				uni.downloadFile({
					url: this.parseResult.video_url,
					success: (res) => {
						this.isLoading = false

						if (res.statusCode === 200) {
							// 保存文件到本地
							uni.saveVideoToPhotosAlbum({
								filePath: res.tempFilePath,
								success: () => {
									util.showToast('视频下载成功')
								},
								fail: (err) => {
									console.error('保存视频失败', err)
									// 如果是用户拒绝授权，可以引导用户开启权限
									if (err.errMsg.indexOf('auth deny') !== -1) {
										this.showAuthModal('需要您授权保存视频到相册权限')
									} else {
										util.showToast('保存视频失败，请稍后重试')
									}
								}
							})
						} else {
							util.showToast('下载视频失败')
							console.error('下载视频失败', res)
						}
					},
					fail: (err) => {
						this.isLoading = false
						util.showToast('下载视频失败，请检查网络连接')
						console.error('下载视频失败', err)
					}
				})
			},

			// 下载图集
			downloadImages() {
				if (!this.parseResult || !this.parseResult.images || this.parseResult.images.length === 0) {
					util.showToast('没有可下载的图片')
					return
				}

				// 显示加载提示
				this.isLoading = true

				// 遍历下载所有图片
				let successCount = 0
				this.parseResult.images.forEach((imageObj, index) => {
					const imageUrl = this.formatImageUrl(imageObj.url);
					uni.downloadFile({
						url: imageUrl,
						success: (res) => {
							if (res.statusCode === 200) {
								// 保存图片到本地
								uni.saveImageToPhotosAlbum({
									filePath: res.tempFilePath,
									success: () => {
										successCount++
										// 检查是否所有图片都下载完成
										if (successCount === this.parseResult.images
											.length) {
											this.isLoading = false
											util.showToast(`成功下载 ${successCount} 张图片`)
										}
									},
									fail: (err) => {
										console.error('保存图片失败', err)
										// 如果是用户拒绝授权，可以引导用户开启权限
										if (err.errMsg.indexOf('auth deny') !== -1 &&
											index === 0) {
											this.showAuthModal('需要您授权保存图片到相册权限')
										}

										// 检查是否所有图片都处理完成
										successCount++
										if (successCount === this.parseResult.images
											.length) {
											this.isLoading = false
											util.showToast(
												`成功下载 ${successCount - 1} 张图片，部分图片下载失败`
											)
										}
									}
								})
							} else {
								console.error('下载图片失败', res)
								successCount++
								if (successCount === this.parseResult.images.length) {
									this.isLoading = false
									util.showToast(`成功下载 ${successCount - 1} 张图片，部分图片下载失败`)
								}
							}
						},
						fail: (err) => {
							console.error('下载图片失败', err)
							successCount++
							if (successCount === this.parseResult.images.length) {
								this.isLoading = false
								util.showToast(`成功下载 ${successCount - 1} 张图片，部分图片下载失败`)
							}
						}
					})
				})
			},

			// 显示授权提示弹窗
			showAuthModal(content) {
				uni.showModal({
					title: '提示',
					content: content,
					confirmText: '去授权',
					success: (res) => {
						if (res.confirm) {
							// 打开系统设置页面
							uni.openSetting()
						}
					}
				})
			},

			// 图片预览功能
			previewImage(current, urls) {
				// 格式化URL数组
				const formattedUrls = urls.map(item => {
					if (typeof item === 'object' && item.url) {
						return this.formatImageUrl(item.url);
					}
					return this.formatImageUrl(item);
				});

				// 格式化当前URL
				const formattedCurrent = this.formatImageUrl(current);

				uni.previewImage({
					current: formattedCurrent,
					urls: formattedUrls,
					indicator: 'default',
					loop: true,
					success: (res) => {
						console.log('预览图片成功', res)
					},
					fail: (err) => {
						console.error('预览图片失败', err)
						util.showToast('预览图片失败')
					}
				})
			},

			// 格式化图片URL，处理可能存在的特殊字符
			formatImageUrl(url) {
				if (!url) return '';

				// 移除可能存在的反引号
				if (typeof url === 'string') {
					url = url.replace(/`/g, '');
				}

				return url;
			},

			// 下载封面
			downloadCover() {
				if (!this.parseResult || !this.parseResult.cover_url) {
					util.showToast('封面链接无效')
					return
				}

				// 显示加载提示
				this.isLoading = true

				// 调用uni.downloadFile进行下载
				uni.downloadFile({
					url: this.parseResult.cover_url,
					success: (res) => {
						this.isLoading = false

						if (res.statusCode === 200) {
							// 保存图片到本地
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: () => {
									util.showToast('封面下载成功')
								},
								fail: (err) => {
									console.error('保存封面失败', err)
									// 如果是用户拒绝授权，可以引导用户开启权限
									if (err.errMsg.indexOf('auth deny') !== -1) {
										this.showAuthModal('需要您授权保存图片到相册权限')
									} else {
										util.showToast('保存封面失败，请稍后重试')
									}
								}
							})
						} else {
							util.showToast('下载封面失败')
							console.error('下载封面失败', res)
						}
					},
					fail: (err) => {
						this.isLoading = false
						util.showToast('下载封面失败，请检查网络连接')
						console.error('下载封面失败', err)
					}
				})
			},

			// 复制视频地址
			copyVideoUrl() {
				if (!this.parseResult || !this.parseResult.video_url) {
					util.showToast('视频链接无效')
					return
				}

				// 复制视频地址到剪贴板
				uni.setClipboardData({
					data: this.parseResult.video_url,
					success: () => {
						util.showToast('视频地址已复制')
					},
					fail: (err) => {
						console.error('复制视频地址失败', err)
						util.showToast('复制视频地址失败，请稍后重试')
					}
				})
			},

			// 下载单个图片
			async downloadSingleImage(event, imageUrl) {
				// 阻止事件冒泡，避免触发预览
				event.stopPropagation();

				// 检查登录状态
				if (!this.isLoggedIn()) {
					util.showToast('请先登录');
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages/login/login'
						});
					}, 1500);
					return;
				}

				// 检查免费次数
				if (this.freeCount <= 0) {
					this.showVipPrompt();
					return;
				}

				if (!imageUrl) {
					util.showToast('图片链接无效')
					return
				}

				try {
					// 尝试扣除免费次数
					await this.deductFreeCount(imageUrl);

					// 显示加载提示
					this.isLoading = true

					// 格式化图片URL
					const formattedUrl = this.formatImageUrl(imageUrl);

					// 调用uni.downloadFile进行下载
					uni.downloadFile({
						url: formattedUrl,
						success: (res) => {
							this.isLoading = false

							if (res.statusCode === 200) {
								// 保存图片到本地
								uni.saveImageToPhotosAlbum({
									filePath: res.tempFilePath,
									success: () => {
										util.showToast('图片保存成功')
									},
									fail: (err) => {
										console.error('保存图片失败', err)
										// 如果是用户拒绝授权，可以引导用户开启权限
										if (err.errMsg.indexOf('auth deny') !== -1) {
											this.showAuthModal('需要您授权保存图片到相册权限')
										} else {
											util.showToast('保存图片失败，请稍后重试')
										}
									}
								})
							} else {
								util.showToast('下载图片失败')
								console.error('下载图片失败', res)
							}
						},
						fail: (err) => {
							this.isLoading = false
							util.showToast('下载图片失败，请检查网络连接')
							console.error('下载图片失败', err)
						}
					})
				} catch (error) {
					console.error('单图下载失败', error);
					// 即使扣除失败，也允许用户继续操作
					// 显示加载提示
					this.isLoading = true

					// 格式化图片URL
					const formattedUrl = this.formatImageUrl(imageUrl);

					// 调用uni.downloadFile进行下载
					uni.downloadFile({
						url: formattedUrl,
						success: (res) => {
							this.isLoading = false

							if (res.statusCode === 200) {
								// 保存图片到本地
								uni.saveImageToPhotosAlbum({
									filePath: res.tempFilePath,
									success: () => {
										util.showToast('图片保存成功')
									},
									fail: (err) => {
										console.error('保存图片失败', err)
										// 如果是用户拒绝授权，可以引导用户开启权限
										if (err.errMsg.indexOf('auth deny') !== -1) {
											this.showAuthModal('需要您授权保存图片到相册权限')
										} else {
											util.showToast('保存图片失败，请稍后重试')
										}
									}
								})
							} else {
								util.showToast('下载图片失败')
								console.error('下载图片失败', res)
							}
						},
						fail: (err) => {
							this.isLoading = false
							util.showToast('下载图片失败，请检查网络连接')
							console.error('下载图片失败', err)
						}
					})
				}
			}
		}
	}
</script>

<style>
	.container {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		background-color: #fff;
	}

	/* 广告Banner */
	.banner {
		margin: 20rpx;
		border-radius: 20rpx;
		overflow: hidden;
	}

	.banner-image {
		width: 100%;
		height: 280rpx
	}

	/* 自定义通告栏组件样式覆盖 */
	.custom-notice-bar {
		margin: 0 20rpx !important;
	}

	/* 快速去水印 */
	.quick-section {
		padding: 30rpx;
	}

	.section-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
	}

	.section-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
	}

	.section-action {
		font-size: 28rpx;
		color: #ff6b6b;
	}

	.input-area {
		margin-bottom: 30rpx;
	}

	.url-input {
		width: 100%;
		height: 120rpx;
		border: 1px solid #ddd;
		border-radius: 10rpx;
		padding: 20rpx;
		font-size: 28rpx;
		box-sizing: border-box;
	}

	.button-group {
		display: flex;
		justify-content: space-between;
	}

	.paste-btn {
		flex: 1;
		height: 90rpx;
		line-height: 90rpx;
		margin-right: 20rpx;
		background-color: #fff;
		color: #ff6b6b;
		border: 1px solid #ff6b6b;
		font-size: 32rpx;
	}

	.parse-btn {
		flex: 1;
		height: 90rpx;
		line-height: 90rpx;
		background-color: #ff6b6b;
		color: #fff;
		font-size: 32rpx;
	}

	/* 解析结果样式 */
	.result-section {
		padding: 30rpx;
		background-color: #f8f8f8;
		margin: 0 30rpx 30rpx;
		border-radius: 15rpx;
	}

	.video-info {
		margin-bottom: 20rpx;
	}

	.video-title {
		font-size: 32rpx;
		color: #333;
		line-height: 1.5;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	.author-info {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.author-avatar {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		margin-right: 15rpx;
	}

	.author-name {
		font-size: 28rpx;
		color: #666;
	}

	.video-preview {
		width: 100%;
		margin-bottom: 20rpx;
	}

	.video-player {
		width: 100%;
		height: 400rpx;
		border-radius: 10rpx;
	}

	.images-preview {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 20rpx;
	}

	.image-item {
		width: 32%;
		margin-right: 2%;
		margin-bottom: 2%;
		position: relative;
	}

	.image-item:nth-child(3n) {
		margin-right: 0;
	}

	.preview-image {
		width: 100%;
		height: 200rpx;
		border-radius: 10rpx;
	}

	/* 单个图片保存按钮 */
	.save-single-image-btn {
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		background-color: rgba(255, 107, 107, 0.9);
		color: #fff;
		font-size: 24rpx;
		margin-top: 10rpx;
		border-radius: 10rpx;
		position: relative;
		z-index: 10;
	}

	/* 免费次数显示 */
.free-count-info {
	margin: 20rpx 30rpx;
}

.free-count-card {
	background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
	border-radius: 12rpx;
	padding: 20rpx 30rpx;
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15rpx;
	box-shadow: 0 4rpx 16rpx rgba(255, 107, 107, 0.3);
}

.free-count-icon {
	font-size: 36rpx;
}

.free-count-text {
	font-size: 28rpx;
	font-weight: 500;
}

.free-count-number {
	font-size: 32rpx;
	font-weight: bold;
	background: rgba(255, 255, 255, 0.25);
	padding: 6rpx 20rpx;
	border-radius: 30rpx;
	min-width: 50rpx;
	text-align: center;
}

/* 操作按钮区域 */
.action-buttons {
	margin: 20rpx 30rpx;
}

/* 按钮行布局 */
.button-row {
	display: flex;
	gap: 10rpx;
	margin-bottom: 10rpx;
}

/* 按钮样式 */
.download-btn {
	flex: 1;
	height: 80rpx;
	line-height: 80rpx;
	background-color: #FF6B6B;
	color: white;
	font-size: 26rpx;
	border-radius: 8rpx;
	border: none;
	text-align: center;
	transition: all 0.2s ease;
	box-shadow: 0 2rpx 8rpx rgba(255, 107, 107, 0.3);
}

.download-btn:active {
	background-color: #FF5252;
	transform: translateY(2rpx);
	box-shadow: 0 1rpx 4rpx rgba(255, 107, 107, 0.2);
}

/* 复制地址按钮特殊样式 */
.button-row:last-child .download-btn {
	background-color: #4ECDC4;
	box-shadow: 0 2rpx 8rpx rgba(78, 205, 196, 0.3);
}

.button-row:last-child .download-btn:active {
	background-color: #45B7AA;
	box-shadow: 0 1rpx 4rpx rgba(78, 205, 196, 0.2);
}

/* 响应式调整 */
@media screen and (max-width: 350px) {
	.download-btn {
		font-size: 24rpx;
		height: 72rpx;
		line-height: 72rpx;
	}
}

	/* 会员引导弹窗样式 */
	.vip-modal {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 9999;
	}

	.vip-modal-content {
		width: 85%;
		background-color: #fff;
		border-radius: 20rpx;
		overflow: hidden;
		box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.15);
	}

	.vip-modal-header {
		position: relative;
		text-align: center;
		padding: 30rpx;
		background: linear-gradient(135deg, #ff6b6b, #ff8e53);
		color: #fff;
	}

	.vip-icon {
		width: 100rpx;
		height: 100rpx;
		margin: 0 auto 20rpx;
		background-color: rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.vip-icon image {
		width: 80rpx;
		height: 80rpx;
	}

	.vip-modal-title {
		font-size: 36rpx;
		font-weight: bold;
	}

	.close-btn {
		position: absolute;
		top: 20rpx;
		right: 20rpx;
		font-size: 36rpx;
		color: rgba(255, 255, 255, 0.8);
		padding: 10rpx;
	}

	.vip-modal-body {
		padding: 40rpx;
	}

	.vip-modal-message {
		font-size: 32rpx;
		color: #666;
		text-align: center;
		display: block;
		margin-bottom: 30rpx;
	}

	.vip-benefits {
		margin-top: 20rpx;
	}

	.vip-benefits-title {
		font-size: 30rpx;
		color: #ff6b6b;
		font-weight: bold;
		display: block;
		margin-bottom: 20rpx;
	}

	.benefit-item {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.benefit-icon {
		width: 40rpx;
		height: 40rpx;
		background-color: #ff6b6b;
		color: #fff;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24rpx;
		margin-right: 20rpx;
	}

	.benefit-text {
		font-size: 28rpx;
		color: #333;
	}

	.vip-modal-footer {
		padding: 0 40rpx 40rpx;
		display: flex;
		gap: 20rpx;
	}

	.cancel-vip-btn {
		flex: 1;
		background-color: #f5f5f5;
		color: #666;
		border: none;
		border-radius: 50rpx;
		font-size: 28rpx;
		padding: 20rpx 0;
	}

	.confirm-vip-btn {
		flex: 2;
		background: linear-gradient(135deg, #ff6b6b, #ff8e53);
		color: #fff;
		border: none;
		border-radius: 50rpx;
		font-size: 28rpx;
		font-weight: bold;
		padding: 20rpx 0;
	}

	/* 更多功能 */
	.more-section {
		padding: 30rpx;
	}

	.more-title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 30rpx;
		display: block;
	}

	.feature-grid {
		display: flex;
		justify-content: space-between;
	}

	.feature-item {
		flex: 1;
		padding: 30rpx 20rpx;
		border-radius: 15rpx;
		text-align: center;
		margin: 0 10rpx;
	}

	.feature-pink {
		background-color: #ff8a80;
	}

	.feature-orange {
		background-color: #ffb74d;
	}

	.feature-purple {
		background-color: #9575cd;
	}

	.feature-name {
		display: block;
		font-size: 32rpx;
		font-weight: bold;
		color: #fff;
		margin-bottom: 10rpx;
	}

	.feature-desc {
		display: block;
		font-size: 24rpx;
		color: #fff;
		opacity: 0.9;
	}
</style>